<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        /**
         *  js可以进行本地存储将数据存储在浏览器
         *  
         *  localStorage、sessionStorage，方法都一样
         * 
         *  1. 存数据：只能存字符串。如果要存数组或对象，需要使用JSON.stringify转化成JSON格式的字符串
         *      （1）localStorage.setItem('键名',值)
         *      （2）sessionStorage.setItem('键名',值)
         *  2. 读取数据：如果是json格式的字符串，需要使用JSON.parse将其还原成数组或对象
         *       （1）localStorage.getItem('键名')
         *        (2) sessionStorage.getItem('键名')
         * 
         *  3. 按键名删除
         *        (1) localStorage.removeItem('键名')
         *        (2) sessionStorage.removeItem('键名')
         *          
         *  4. 全部删除
         *      localStorage.clear()
         * 
         * 
         *  5. localStorage 和 sessionStorage的区别
         *  localStorage：是永久本地存储，浏览器或当前会话关闭仍然存在
         *  sessionStorage：是当前会话存储，当前会话关闭或浏览器关闭，数据消失
         * 
         */


        let className = '221013'
        let num = 1000;
        let arr = [1,2,3]
        let user = {
            name:'atguigu',
            age:109
        }
        let users = [
            {
                id:1,
                name:'123',
                age:20
            },
            {
                id:2,
                name:'222',
                age:21
            }
        ]

        localStorage.setItem('class', className)
        localStorage.setItem('num', num)
        localStorage.setItem('arr', arr)
        localStorage.setItem('user', user)
        console.log('user string ',user.toString())
        // 如果想存数组或对象，需要先转化为json格式的字符串，之后在存储
        console.log(JSON.stringify(user), typeof JSON.stringify(user))
        console.log(JSON.stringify(users), typeof JSON.stringify(users))

        // localStorage.setItem('users', JSON.stringify(users))
        // localStorage.setItem('user', JSON.stringify(user))

        // sessionStorage.setItem('class123', className)

        // 2 读取
        let userStr = localStorage.getItem('users')
        console.log(userStr, typeof userStr)
        // 将Json格式的字符串，恢复成数组或对象 JSON.parse

        users = JSON.parse(localStorage.getItem('users'))
        console.log(users[1], typeof users)

        // 3. 

        localStorage.removeItem('arr')
        localStorage.removeItem('num')
        // 4. 全部删除
        // localStorage.clear()
    </script>
</body>
</html>